// 获取标签页导航元素
let tabName=document.querySelector("#tabNav");

// 获取所有标签页导航中的li元素
let lis=tabName.querySelectorAll("li");

// 获取所有内容项元素
let items=document.querySelectorAll(".item");//获取item选择器

// 遍历标签页导航中的每个li元素
for(let i=0;i<lis.length;i++){
	// 给每个li元素增加点击事件
	lis[i].onclick=function(){
		// 取消所有li元素的样式
		lis.forEach(value=>{value.className='';});
        
		//把当前点击的li元素设置为active样式
		lis[i].className='active';
		
		items.forEach(value=>{value.className='item'});//设置点击的时候item内容都隐藏
		items[i].className='item show';//设置该遍历的索引显示该内容
	}
}